/*----------------------------------------*\
  INTRANET
\*----------------------------------------*/

@layer base {
  .body--intranet {
    --color-primary-50: #eff6ff;
    --color-primary-100: #dbeafe;
    --color-primary-200: #bfdbfe;
    --color-primary-300: #93c5fd;
    --color-primary-400: #60a5fa;
    --color-primary-500: #3b82f6;
    --color-primary-600: #2563eb;
    --color-primary-700: #1d4ed8;
    --color-primary-800: #1e40af;
    --color-primary-900: #1e3a8a;

    /* light secondary colors are grey */
    --color-secondary-50: #f0f4f7;
    --color-secondary-100: #dfe4e9;
    --color-secondary-200: #acb4bd;
    --color-secondary-300: #828e9a;

    /* dense secondary colors are blue */
    --color-secondary-400: #5076b3;
    --color-secondary-500: #234dc2;
    --color-secondary-600: #1e40af;
    --color-secondary-700: #1e3a8a;
    --color-secondary-800: #1c3c7d;
    --color-secondary-900: #1c3c7d;

    .logo__title::after {
      @apply content-['Intranet'];
      @apply badge badge--blue mt-1 -ml-[1px];
      @apply block w-fit;
    }

    .logo__accronym::after {
      @apply content-['Intranet'];
      @apply badge badge--blue mt-1 -ml-[1px];
      @apply block w-fit;
      @apply text-xs;
    }
  }
}
